// custom-tab-bar/index.js
//1. 导入模块(引用store的公共数据)
import {storeBindingsBehavior} from 'mobx-miniprogram-bindings'
import {store} from '../store/store'

Component({
  //添加options属性
  options:{
    //添加此属性后，修改样式才生效
    styleIsolation:'shared' //参考van-weapp说明
  },

  //2. 映射模块到组件
  behaviors:[storeBindingsBehavior],

  //3. 定义数据绑定对象 storeBindings
  storeBindings:{
    store,
    fields:{
      // numA:()=>store.numA,不需要
      // numB:(store)=>store.numB,不需要
      sum:'sum',
      //把store的数据字段activeTabbarIndex映射到导航组件的数据字段
      active:'activeTabbarIndex'
    },

    //将store的updateActiveTabbarIndex方法映射到导航组件
    actions:{
      updateActive:'updateActiveTabbarIndex'
    }
  },

  //4. 建立监听(让组件中的sum跟底部导航关联起来)
  observers:{
    'sum':function(val){
      // console.log(val)
      this.setData({
        //重新赋值给info
        'list[1].info':val
      })
    }
  },


  /**
   * 组件的属性列表
   */
  properties: {

  },

  /**
   * 组件的初始数据
   */
  data: {
    // active:0,转移到store.js中
    "list": [
      {
        "pagePath": "/pages/home/home",
        "text": "首页",
        "iconPath": "/assets/icons/home.png",
        "selectedIconPath": "/assets/icons/home-active.png"
      },
      {
        "pagePath": "/pages/message/message",
        "text": "消息",
        "iconPath": "/assets/icons/message.png",
        "selectedIconPath": "/assets/icons/message-active.png",
        info:0,
      },
      {
        "pagePath": "/pages/recommand/recommand",
        "text": "练习",
        "iconPath": "/assets/icons/recommand.png",
        "selectedIconPath": "/assets/icons/recommand-active.png"
      },
      {
        "pagePath": "/pages/contact/contact",
        "text": "联系我们",
        "iconPath": "/assets/icons/contact.png",
        "selectedIconPath": "/assets/icons/contact-active.png"
      }
    ]
  },

  /**
   * 组件的方法列表
   */
  methods: {
    onChange(e){
      // this.setData({active:e.detail})因为已经移到store了
      this.updateActive(e.detail) //完成修改导航的active

      wx.switchTab({
        url: this.data.list[e.detail].pagePath,
      })
    }
  }
})
